<template>
  <div>
    <el-form ref="modelForm" :model="modelForm" label-position="right" label-width="100px">
      <div v-for="(item, index) in modelForm.topic" :key="index">
        <el-collapse>
          <el-collapse-item :key="index">
            <template v-slot:title="title">
              第{{ index+1 }}题:{{ item.questionName }}
            </template>
            <!-- 答案 -->
            <el-form-item
                v-for="(opt, idx) in item.answers"
                v-if="item.type !== 3"
                :key="idx"
                :prop="`topic.${index}.answers.${idx}.choiceText`"
                :rules="[
                  { required: true, message: '请输入答案', trigger: 'blur' },
                ]"
            >
              <el-checkbox v-model.trim="opt.choiceText" style="width:20px"/>{{opt.choiceText}}
            </el-form-item>
            <el-form-item v-else>
              <el-input></el-input>
            </el-form-item>
          </el-collapse-item>
        </el-collapse>
      </div>
    </el-form>
<!--    <el-button @click="loadData()">测试</el-button>-->
  </div>
</template>

<script>
export default {
  name: "LookQuestionnaire",
  data() {
    return {
      qid: this.$cookies.get('qid'),
      modelForm: {
        topic: [{

        }]
      }
    }
  },
  methods: {
    loadData() {
      var qNum = 0;
      var cNum = 0;
      let formData = new FormData();
      formData.append('qid',this.qid);
      let ans=[]
      this.$axios.post('http://localhost:8090/questionnaire/questionnaireInfo', formData).then(res=>res.data).then(

          res=>{
            console.log(res.data)
        for(;qNum<res.data.questions.length;qNum++){
          ans.push({ type: res.data.questions[qNum].questionType, questionName: res.data.questions[qNum].questionText, answers: []});
          for(;cNum<res.data.choices.length;cNum++){
            if(res.data.choices[cNum].quesCount === res.data.questions[qNum].count){
              ans[qNum].answers.push({ quesCount: res.data.choices[cNum].quesCount,toQuestion: res.data.choices[cNum].toQuestion,choiceText: res.data.choices[cNum].choiceText})
            }
          }
          cNum = 0;
        }
        this.modelForm.topic=ans

      })
    }
  },
  beforeMount() {
    this.loadData()
  },
  mounted() {
    console.log(1)
  }
}
</script>

<style scoped>

</style>
